/* iOS-style segmented control */
.segmented-control-container {
    padding: 20rpx 30rpx;
    background-color: #f7f7f7;
}

.segmented-control {
    display: flex;
    background-color: #e9e9eb;
    border-radius: 10rpx;
    padding: 4rpx;
}

.segmented-item {
    flex: 1;
    text-align: center;
    font-size: 28rpx;
    color: #8e8e93;
    padding: 16rpx 0;
    transition: all 0.3s;
}

.segmented-active {
    background-color: #ffffff;
    color: #007aff;
    border-radius: 8rpx;
    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
}

/* iOS-style collection list */
.collection-container {
    padding: 0 30rpx;
    margin-top: 20rpx;
}

.collection-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #ffffff;
    margin-bottom: 20rpx;
    border-radius: 16rpx;
    padding: 30rpx;
    box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}

.item-content {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.item-title {
    font-size: 32rpx;
    color: #000000;
    font-weight: 500;
    margin-bottom: 8rpx;
}

.chevron-icon {
    color: #c7c7cc;
    font-size: 36rpx;
}

/* Overriding background color for the entire page */
page {
    background-color: #f7f7f7;
}
